// 添加路由守卫控制页面的跳转
import router from '@/router/index'
// 引入vuex 子组件里面的数据
import store from '@/store'
// 路由导航 to是去那个网页的地址 from 是来自那个网页的地址 next是一个函数,可以放行
import NProgress from 'nprogress' // 引入进度条这个方法
import 'nprogress/nprogress.css' // 引入进度条的样式
router.beforeEach((to, from, next) => {
//   console.log(to.path, from.path, next, 'before')
//   next()放行
// 开启进度条,每次跳转的时候都会开启进度条
  NProgress.start()
  // 获取token来进行判断的条件
  const token = store.state.user.token
  //   console.log(token, 'token获取的值')
  //   获取token之后按照token来进行判断条件
  // whitelist是白名单的意思
  const whiteList = ['/login', '/404']
  if (token) {
    if (to.path === '/login') {
      // next可以跳转到想要跳转的网页 如果想要去login网页的话那么就跳转的首页
      next('/')
      //   关闭进度条
      NProgress.done()
    } else {
      // 如果有token不是去login页放行
      next()
      // 会触发函数,发送数据请求用户的数据
      store.dispatch('user/getUserInfo')
      NProgress.done()
    }
  } else {
    //    includes是数组的一种方法,包含的话返回是true,不包含的话返回是false
    // includes检测数组中是否有这种方法,有的话返回的是true,没有的话返回的是false
    if (whiteList.includes(to.path)) {
      next()
      NProgress.done()// 关闭
    } else {
      // 但是next里面有指定地址的话router.afterEach这个函数是不执行的
      next('/login')
      NProgress.done()// 关闭
    }
  }
})
// router.afterEach是路由跳转完成之后经过的钩子函数
router.afterEach(() => {
  NProgress.done()
})
